import React from 'react';
import { BrowserRouter as Router, Routes, Route, Navigate, Outlet } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/lib/locale/zh_CN';
import { antdTheme } from './g-config/theme';
import * as GPage from './g-page';
import { BasicLayout } from './g-index/BasicLayout';

/**
 * 身份验证守卫
 * @param props - 组件属性
 * @returns 守卫后的组件
 */
const AuthGuard: React.FC<{ children: React.ReactNode }> = ({ children }) => {
  const token = localStorage.getItem('token');
  
  if (!token) {
    // 未登录，重定向到登录页
    return <Navigate to="/login" replace />;
  }
  
  return <>{children}</>;
};

/**
 * 带有基础布局的组件
 */
const LayoutWrapper: React.FC = () => {
  const handleLogout = () => {
    localStorage.removeItem('token');
    localStorage.removeItem('user');
    window.location.href = '/login';
  };

  return (
    <AuthGuard>
      <BasicLayout onLogout={handleLogout}>
        <Outlet />
      </BasicLayout>
    </AuthGuard>
  );
};

/**
 * 临时路由占位组件
 */
const TempRoute: React.FC<{ path: string }> = ({ path }) => {
  return (
    <div style={{ padding: '50px 20px' }}>
      <h2>路由 {path} 正在开发中</h2>
      <p>这是一个临时占位页面，该功能模块尚未开发完成。</p>
    </div>
  );
};

/**
 * App根组件
 */
const App: React.FC = () => {
  return (
    <ConfigProvider
      theme={antdTheme}
      locale={zhCN}
    >
      <Router>
        <Routes>
          {/* 登录页面 - 不需要布局 */}
          <Route path="/login" element={<GPage.Login />} />
          
          {/* 主布局 - 包含所有需要布局的页面 */}
          <Route path="/" element={<LayoutWrapper />}>
            {/* 默认重定向到仪表盘 */}
            <Route index element={<Navigate to="/dashboard" replace />} />
            
            {/* 仪表盘 */}
            <Route path="dashboard" element={<GPage.DashboardContent />} />
            
            {/* 用户管理 */}
            <Route path="user">
              <Route path="list" element={<GPage.UserListContent />} />
              <Route path="group" element={<GPage.UserGroupContent />} />
              <Route path="group/:id" element={<GPage.UserGroupDetail />} />
            </Route>
            
            {/* 系统管理 */}
            <Route path="system">
              <Route path="role" element={<TempRoute path="/system/role" />} />
              <Route path="permission" element={<TempRoute path="/system/permission" />} />
              <Route path="dict" element={<TempRoute path="/system/dict" />} />
              <Route path="log" element={<TempRoute path="/system/log" />} />
              <Route path="bug" element={<GPage.BugList />} />
            </Route>
            
            {/* 组织管理 */}
            <Route path="organization">
              <Route path="department" element={<TempRoute path="/organization/department" />} />
              <Route path="position" element={<TempRoute path="/organization/position" />} />
            </Route>
            
            {/* 内容管理 */}
            <Route path="content">
              <Route path="article" element={<TempRoute path="/content/article" />} />
              <Route path="category" element={<TempRoute path="/content/category" />} />
              <Route path="tag" element={<TempRoute path="/content/tag" />} />
            </Route>
            
            {/* 产品管理 */}
            <Route path="product">
              <Route path="list" element={<GPage.ProductListContent />} />
              <Route path="category" element={<GPage.CategoryListContent />} />
            </Route>
            
            {/* 订单管理 */}
            <Route path="order">
              <Route path="list" element={<TempRoute path="/order/list" />} />
              <Route path="setting" element={<TempRoute path="/order/setting" />} />
            </Route>
            
            {/* 通配符路由 - 重定向到仪表盘 */}
            <Route path="*" element={<Navigate to="/dashboard" replace />} />
          </Route>
        </Routes>
      </Router>
    </ConfigProvider>
  );
};

export default App;
